<template>
  <header>
    <van-icon class="arrow-left" name="arrow-left" @click="goBack" size="1.5rem" />
    <van-search
    shape="round"
      v-model="value"
      show-action
      placeholder="请输入搜索关键词"
   
    >
      <template #action>
        <van-button size="small" @click="onSearch" class="btn-search" color="red">搜索</van-button>
      </template>
    </van-search>
  </header>
</template>

<script>
export default {
  name: "tou",
  data() {
    return {
      value: "",
    };
  },
  methods: {
    onSearch(val) {
      this.$router.push(`/Brand?keyword=${this.value}`);
    },
    onCancel() {
      
    },
    goBack() {
      this.$router.back();
    },
  },
};
</script>

<style scoped>
header {
  width: 100%;
  display: flex;
  justify-content: space-around;
  box-sizing: border-box;
  align-items: center;
}

.btn-search{
    margin-left: 1.5rem;
    margin-bottom: 0.5rem;
}

</style>